今天是番外篇的最後一篇文章，其實到目前為止，也已經做到如何使用 gulp 來執行 webpack 了，只是還有一個小小的問題，我想做改良，也就是輸出的訊息。
在 gulpfile.js 檔案中，webpack 與 webpack-dev-server 任務如下：
…
gulp.task("webpack", function(callback) {
// run webpack
webpack(webpackConfig, function(err, stats) {
if(err) throw new gutil.PluginError("webpack", err);
gutil.log("[webpack]", stats.toString({
// output options
}));
callback();
});
});
gulp.task("webpack-dev-server", function(callback) {
var myConfig = Object.create(webpackConfig);
// Start a webpack-dev-server
new WebpackDevServer(webpack(myConfig), {
publicPath: "/" + myConfig.output.publicPath,
stats: {
colors: true
}
}).listen(8080, "localhost", function(err) {
if(err) throw new gutil.PluginError("webpack-dev-server", err);
gutil.log("[webpack-dev-server]", "http://localhost:8080/webpack-dev-server/index.html");
});
});
若這時我執行 gulp webpack 或 gulp webpack-dev-server 指令時，會輸出非常大量的訊息，如下(請快速掃瞄過去即可)：
[23:51:13] Using gulpfile ~/Documents/Carlos/company/projects/webpack_proj/gulpfile.js
[23:51:13] Starting 'webpack'...
clean-webpack-plugin: /Users/carlos/Documents/Carlos/company/projects/webpack_proj/dist has been removed.
clean-webpack-plugin: 1 file(s) excluded - 05ef02be5a02714eab77.vendor.js
The webpack build process is starting!!!
[23:51:17] [webpack] Hash: 54b12fec6e3ac3028a34
Version: webpack 2.1.0-beta.27
Time: 3779ms
Asset Size Chunks Chunk Names
517819e2edacb58f7406.react.js 546 bytes 6, 8 [emitted] react
test-37805d3e78d3d5edc40d43d62dc9ebf2.png 3.02 kB [emitted]
692eed1e7d90472d10f5.0.js 256 bytes 0, 8 [emitted]
d10f7007a2e891182a9b.vendor_react.js 724 kB 1, 8 [emitted] vendor_react
fb3af3d2272c98127cd3.vendor.js 982 kB 2, 8 [emitted] vendor
ce5ee126441b838d0255.app.js 13.5 kB 3, 8 [emitted] app
18755eaa92f20126c13d.component_collection.js 5.24 kB 4, 8 [emitted] component_collection
b9bf4686146ad520f985.test_external.js 502 bytes 5, 8 [emitted] test_external
webpack-532a8eda5bf69bf78857fad01d675c44.svg 2.39 kB [emitted]
13ccb3122f204e277e1b.another.js 297 bytes 7, 8 [emitted] another
1bc95dd7dad91c667477.manifest.js 5.59 kB 8 [emitted] manifest
assets/css/app.css 58 bytes 3, 8 [emitted] app
assets/css/component_collection.css 99 bytes 4, 8 [emitted] component_collection
custom-manifest.json 734 bytes [emitted]
assets/static/css/file2.css 26 bytes [emitted]
assets/static/css/file1.css 24 bytes [emitted]
chunk {0} 692eed1e7d90472d10f5.0.js 88 bytes {7} [rendered]
[202] ./app/a1.js 44 bytes {0} [built]
[203] ./app/a2.js 44 bytes {0} [built]
chunk {1} d10f7007a2e891182a9b.vendor_react.js (vendor_react) 702 kB {8} [initial] [rendered]
[1] ./~/process/browser.js 5.3 kB {1} [built]
[2] ./~/fbjs/lib/invariant.js 1.63 kB {1} [built]
[3] ./~/fbjs/lib/warning.js 2.1 kB {1} [built]
[4] ./~/react-dom/lib/reactProdInvariant.js 1.24 kB {1} [built]
[5] ./~/object-assign/index.js 1.99 kB {1} [built]
[6] ./~/react-dom/lib/ReactDOMComponentTree.js 6.16 kB {1} [built]
[7] ./~/fbjs/lib/ExecutionEnvironment.js 1.06 kB {1} [built]
[8] ./~/react/lib/ReactComponentTreeHook.js 10.4 kB {1} [built]
[9] ./~/react-dom/lib/ReactInstrumentation.js 601 bytes {1} [built]
[10] ./~/fbjs/lib/emptyFunction.js 1.08 kB {1} [built]
[11] ./~/react-dom/lib/ReactUpdates.js 9.53 kB {1} [built]
[12] ./~/react/lib/ReactCurrentOwner.js 623 bytes {1} [built]
[13] ./~/react-dom/lib/SyntheticEvent.js 9.18 kB {1} [built]
[14] ./~/react-dom/lib/DOMProperty.js 8.24 kB {1} [built]
[15] ./~/react-dom/lib/PooledClass.js 3.68 kB {1} [built]
[16] ./~/react/lib/ReactElement.js 11.2 kB {1} [built]
[17] ./~/react/lib/reactProdInvariant.js 1.24 kB {1} [built]
[18] ./~/react-dom/lib/DOMLazyTree.js 3.71 kB {1} [built]
[19] ./~/react-dom/lib/ReactReconciler.js 6.21 kB {1} [built]
[20] ./~/react/lib/React.js 2.69 kB {1} [built]
[21] ./~/react-dom/index.js 59 bytes {1} [built]
[22] ./~/react/react.js 56 bytes {1} [built]
[23] ./~/fbjs/lib/emptyObject.js 458 bytes {1} [built]
[24] ./~/react-dom/lib/EventPluginHub.js 9.11 kB {1} [built]
[25] ./~/react-dom/lib/EventPropagators.js 5.09 kB {1} [built]
[26] ./~/react-dom/lib/ReactInstanceMap.js 1.22 kB {1} [built]
[27] ./~/react-dom/lib/SyntheticUIEvent.js 1.57 kB {1} [built]
[28] ./~/react-dom/lib/EventPluginRegistry.js 9.75 kB {1} [built]
[29] ./~/react-dom/lib/ReactBrowserEventEmitter.js 12.6 kB {1} [built]
[30] ./~/react-dom/lib/SyntheticMouseEvent.js 2.14 kB {1} [built]
[31] ./~/react-dom/lib/Transaction.js 9.45 kB {1} [built]
[32] ./~/react-dom/lib/escapeTextContentForBrowser.js 3.43 kB {1} [built]
[33] ./~/react-dom/lib/setInnerHTML.js 3.86 kB {1} [built]
[35] ./~/fbjs/lib/shallowEqual.js 1.74 kB {1} [built]
[36] ./~/react-dom/lib/DOMChildrenOperations.js 7.67 kB {1} [built]
[37] ./~/react-dom/lib/DOMNamespaces.js 505 bytes {1} [built]
[38] ./~/react-dom/lib/EventPluginUtils.js 7.95 kB {1} [built]
[39] ./~/react-dom/lib/KeyEscapeUtils.js 1.29 kB {1} [built]
[40] ./~/react-dom/lib/LinkedValueUtils.js 5.15 kB {1} [built]
[41] ./~/react-dom/lib/ReactComponentEnvironment.js 1.3 kB {1} [built]
[42] ./~/react-dom/lib/ReactErrorUtils.js 2.25 kB {1} [built]
[43] ./~/react-dom/lib/ReactUpdateQueue.js 9.01 kB {1} [built]
[44] ./~/react-dom/lib/createMicrosoftUnsafeLocalFunction.js 810 bytes {1} [built]
[45] ./~/react-dom/lib/getEventCharCode.js 1.5 kB {1} [built]
[46] ./~/react-dom/lib/getEventModifierState.js 1.23 kB {1} [built]
[47] ./~/react-dom/lib/getEventTarget.js 1.01 kB {1} [built]
[48] ./~/react-dom/lib/isEventSupported.js 1.94 kB {1} [built]
[49] ./~/react-dom/lib/shouldUpdateReactComponent.js 1.4 kB {1} [built]
[50] ./~/react-dom/lib/validateDOMNesting.js 13.7 kB {1} [built]
[51] ./~/react/lib/ReactComponent.js 4.61 kB {1} [built]
[52] ./~/react/lib/ReactNoopUpdateQueue.js 3.36 kB {1} [built]
[53] ./~/react/lib/ReactPropTypeLocationNames.js 572 bytes {1} [built]
[54] ./~/react/lib/canDefineProperty.js 661 bytes {1} [built]
[55] ./~/react/lib/getIteratorFn.js 1.12 kB {1} [built]
[57] ./~/fbjs/lib/EventListener.js 2.67 kB {1} [built]
[58] ./~/fbjs/lib/focusNode.js 704 bytes {1} [built]
[59] ./~/fbjs/lib/getActiveElement.js 895 bytes {1} [built]
[168] ./~/react-dom/lib/CSSProperty.js 3.66 kB {1} [built]
[169] ./~/react-dom/lib/CallbackQueue.js 3.16 kB {1} [built]
[170] ./~/react-dom/lib/DOMPropertyOperations.js 7.61 kB {1} [built]
[171] ./~/react-dom/lib/ReactDOMComponentFlags.js 429 bytes {1} [built]
[172] ./~/react-dom/lib/ReactDOMSelect.js 6.81 kB {1} [built]
[173] ./~/react-dom/lib/ReactEmptyComponent.js 704 bytes {1} [built]
[174] ./~/react-dom/lib/ReactFeatureFlags.js 628 bytes {1} [built]
[175] ./~/react-dom/lib/ReactHostComponent.js 2.38 kB {1} [built]
[176] ./~/react-dom/lib/ReactInputSelection.js 4.27 kB {1} [built]
[177] ./~/react-dom/lib/ReactMount.js 25.5 kB {1} [built]
[178] ./~/react-dom/lib/ReactNodeTypes.js 1.02 kB {1} [built]
[179] ./~/react-dom/lib/ReactPropTypesSecret.js 442 bytes {1} [built]
[180] ./~/react-dom/lib/ViewportMetrics.js 606 bytes {1} [built]
[181] ./~/react-dom/lib/accumulateInto.js 1.69 kB {1} [built]
[182] ./~/react-dom/lib/forEachAccumulated.js 855 bytes {1} [built]
[183] ./~/react-dom/lib/getHostComponentFromComposite.js 740 bytes {1} [built]
[184] ./~/react-dom/lib/getTextContentAccessor.js 955 bytes {1} [built]
[185] ./~/react-dom/lib/instantiateReactComponent.js 4.79 kB {1} [built]
[186] ./~/react-dom/lib/isTextInputElement.js 1.04 kB {1} [built]
[187] ./~/react-dom/lib/setTextContent.js 1.45 kB {1} [built]
[188] ./~/react-dom/lib/traverseAllChildren.js 7.04 kB {1} [built]
[189] ./~/react/lib/ReactElementSymbol.js 622 bytes {1} [built]
[190] ./~/react/lib/ReactElementValidator.js 7.95 kB {1} [built]
[191] ./~/react/lib/ReactPropTypesSecret.js 442 bytes {1} [built]
[206] ./~/fbjs/lib/camelize.js 708 bytes {1} [built]
[207] ./~/fbjs/lib/camelizeStyleName.js 1 kB {1} [built]
[208] ./~/fbjs/lib/containsNode.js 1.05 kB {1} [built]
[209] ./~/fbjs/lib/createArrayFromMixed.js 4.11 kB {1} [built]
[210] ./~/fbjs/lib/createNodesFromMarkup.js 2.66 kB {1} [built]
[211] ./~/fbjs/lib/getMarkupWrap.js 3.04 kB {1} [built]
[212] ./~/fbjs/lib/getUnboundedScrollPosition.js 1.05 kB {1} [built]
[213] ./~/fbjs/lib/hyphenate.js 800 bytes {1} [built]
[214] ./~/fbjs/lib/hyphenateStyleName.js 974 bytes {1} [built]
[215] ./~/fbjs/lib/isNode.js 693 bytes {1} [built]
[216] ./~/fbjs/lib/isTextNode.js 605 bytes {1} [built]
[217] ./~/fbjs/lib/memoizeStringOnly.js 698 bytes {1} [built]
[218] ./~/fbjs/lib/performance.js 588 bytes {1} [built]
[219] ./~/fbjs/lib/performanceNow.js 845 bytes {1} [built]
[221] ./~/react-dom/lib/ARIADOMPropertyConfig.js 1.82 kB {1} [built]
[222] ./~/react-dom/lib/AutoFocusUtils.js 599 bytes {1} [built]
[223] ./~/react-dom/lib/BeforeInputEventPlugin.js 13.3 kB {1} [built]
[224] ./~/react-dom/lib/CSSPropertyOperations.js 6.87 kB {1} [built]
[225] ./~/react-dom/lib/ChangeEventPlugin.js 11.1 kB {1} [built]
[226] ./~/react-dom/lib/Danger.js 2.24 kB {1} [built]
[227] ./~/react-dom/lib/DefaultEventPluginOrder.js 1.08 kB {1} [built]
[228] ./~/react-dom/lib/EnterLeaveEventPlugin.js 3.16 kB {1} [built]
[229] ./~/react-dom/lib/FallbackCompositionState.js 2.43 kB {1} [built]
[230] ./~/react-dom/lib/HTMLDOMPropertyConfig.js 5.44 kB {1} [built]
[231] ./~/react-dom/lib/ReactChildReconciler.js 6.11 kB {1} [built]
[232] ./~/react-dom/lib/ReactComponentBrowserEnvironment.js 906 bytes {1} [built]
[233] ./~/react-dom/lib/ReactCompositeComponent.js 35.2 kB {1} [built]
[234] ./~/react-dom/lib/ReactDOM.js 5.14 kB {1} [built]
[235] ./~/react-dom/lib/ReactDOMComponent.js 38.2 kB {1} [built]
[236] ./~/react-dom/lib/ReactDOMContainerInfo.js 967 bytes {1} [built]
[237] ./~/react-dom/lib/ReactDOMEmptyComponent.js 1.9 kB {1} [built]
[238] ./~/react-dom/lib/ReactDOMFeatureFlags.js 439 bytes {1} [built]
[239] ./~/react-dom/lib/ReactDOMIDOperations.js 956 bytes {1} [built]
[240] ./~/react-dom/lib/ReactDOMInput.js 12 kB {1} [built]
[241] ./~/react-dom/lib/ReactDOMInvalidARIAHook.js 3.14 kB {1} [built]
[242] ./~/react-dom/lib/ReactDOMNullInputValuePropHook.js 1.37 kB {1} [built]
[243] ./~/react-dom/lib/ReactDOMOption.js 3.69 kB {1} [built]
[244] ./~/react-dom/lib/ReactDOMSelection.js 6.78 kB {1} [built]
[245] ./~/react-dom/lib/ReactDOMTextComponent.js 5.82 kB {1} [built]
[246] ./~/react-dom/lib/ReactDOMTextarea.js 6.22 kB {1} [built]
[247] ./~/react-dom/lib/ReactDOMTreeTraversal.js 3.72 kB {1} [built]
[248] ./~/react-dom/lib/ReactDOMUnknownPropertyHook.js 4.32 kB {1} [built]
[249] ./~/react-dom/lib/ReactDebugTool.js 11.7 kB {1} [built]
[250] ./~/react-dom/lib/ReactDefaultBatchingStrategy.js 1.88 kB {1} [built]
[251] ./~/react-dom/lib/ReactDefaultInjection.js 3.5 kB {1} [built]
[252] ./~/react-dom/lib/ReactElementSymbol.js 622 bytes {1} [built]
[253] ./~/react-dom/lib/ReactEventEmitterMixin.js 959 bytes {1} [built]
[254] ./~/react-dom/lib/ReactEventListener.js 5.3 kB {1} [built]
[255] ./~/react-dom/lib/ReactHostOperationHistoryHook.js 736 bytes {1} [built]
[256] ./~/react-dom/lib/ReactInjection.js 1.2 kB {1} [built]
[257] ./~/react-dom/lib/ReactInvalidSetStateWarningHook.js 984 bytes {1} [built]
[258] ./~/react-dom/lib/ReactMarkupChecksum.js 1.47 kB {1} [built]
[259] ./~/react-dom/lib/ReactMultiChild.js 14.6 kB {1} [built]
[260] ./~/react-dom/lib/ReactOwner.js 3.53 kB {1} [built]
[261] ./~/react-dom/lib/ReactPropTypeLocationNames.js 572 bytes {1} [built]
[262] ./~/react-dom/lib/ReactReconcileTransaction.js 5.26 kB {1} [built]
[263] ./~/react-dom/lib/ReactRef.js 2.56 kB {1} [built]
[264] ./~/react-dom/lib/ReactServerRenderingTransaction.js 2.29 kB {1} [built]
[265] ./~/react-dom/lib/ReactServerUpdateQueue.js 4.83 kB {1} [built]
[266] ./~/react-dom/lib/ReactVersion.js 350 bytes {1} [built]
[267] ./~/react-dom/lib/SVGDOMPropertyConfig.js 7.32 kB {1} [built]
[268] ./~/react-dom/lib/SelectEventPlugin.js 6.06 kB {1} [built]
[269] ./~/react-dom/lib/SimpleEventPlugin.js 7.97 kB {1} [built]
[270] ./~/react-dom/lib/SyntheticAnimationEvent.js 1.21 kB {1} [built]
[271] ./~/react-dom/lib/SyntheticClipboardEvent.js 1.17 kB {1} [built]
[272] ./~/react-dom/lib/SyntheticCompositionEvent.js 1.1 kB {1} [built]
[273] ./~/react-dom/lib/SyntheticDragEvent.js 1.07 kB {1} [built]
[274] ./~/react-dom/lib/SyntheticFocusEvent.js 1.07 kB {1} [built]
[275] ./~/react-dom/lib/SyntheticInputEvent.js 1.09 kB {1} [built]
[276] ./~/react-dom/lib/SyntheticKeyboardEvent.js 2.71 kB {1} [built]
[277] ./~/react-dom/lib/SyntheticTouchEvent.js 1.28 kB {1} [built]
[278] ./~/react-dom/lib/SyntheticTransitionEvent.js 1.23 kB {1} [built]
[279] ./~/react-dom/lib/SyntheticWheelEvent.js 1.94 kB {1} [built]
[280] ./~/react-dom/lib/adler32.js 1.19 kB {1} [built]
[281] ./~/react-dom/lib/checkReactTypeSpec.js 4.21 kB {1} [built]
[282] ./~/react-dom/lib/dangerousStyleValue.js 3.02 kB {1} [built]
[283] ./~/react-dom/lib/findDOMNode.js 2.46 kB {1} [built]
[284] ./~/react-dom/lib/flattenChildren.js 2.77 kB {1} [built]
[285] ./~/react-dom/lib/getEventKey.js 2.87 kB {1} [built]
[286] ./~/react-dom/lib/getIteratorFn.js 1.12 kB {1} [built]
[287] ./~/react-dom/lib/getNextDebugID.js 437 bytes {1} [built]
[288] ./~/react-dom/lib/getNodeForCharacterOffset.js 1.62 kB {1} [built]
[289] ./~/react-dom/lib/getVendorPrefixedEventName.js 2.87 kB {1} [built]
[290] ./~/react-dom/lib/quoteAttributeValueForBrowser.js 700 bytes {1} [built]
[291] ./~/react-dom/lib/renderSubtreeIntoContainer.js 422 bytes {1} [built]
[292] ./~/react/lib/KeyEscapeUtils.js 1.29 kB {1} [built]
[293] ./~/react/lib/PooledClass.js 3.68 kB {1} [built]
[294] ./~/react/lib/ReactChildren.js 6.19 kB {1} [built]
[295] ./~/react/lib/ReactClass.js 26.5 kB {1} [built]
[296] ./~/react/lib/ReactDOMFactories.js 5.53 kB {1} [built]
[297] ./~/react/lib/ReactPropTypes.js 15.8 kB {1} [built]
[298] ./~/react/lib/ReactPureComponent.js 1.32 kB {1} [built]
[299] ./~/react/lib/ReactVersion.js 350 bytes {1} [built]
[300] ./~/react/lib/checkReactTypeSpec.js 4.19 kB {1} [built]
[301] ./~/react/lib/onlyChild.js 1.34 kB {1} [built]
[302] ./~/react/lib/traverseAllChildren.js 7.03 kB {1} [built]
[311] multi vendor_react 40 bytes {1} [built]
chunk {2} fb3af3d2272c98127cd3.vendor.js (vendor) 979 kB {1} [initial] [rendered]
[0] ./~/moment/moment.js 123 kB {2} [built]
[34] ./~/lodash/lodash.js 539 kB {2} [built]
[60] ./~/moment/locale/af.js 2.39 kB {2} [optional] [built]
[61] ./~/moment/locale/ar-dz.js 1.9 kB {2} [optional] [built]
[62] ./~/moment/locale/ar-ly.js 3.71 kB {2} [optional] [built]
[63] ./~/moment/locale/ar-ma.js 1.95 kB {2} [optional] [built]
[64] ./~/moment/locale/ar-sa.js 2.81 kB {2} [optional] [built]
[65] ./~/moment/locale/ar-tn.js 1.86 kB {2} [optional] [built]
[66] ./~/moment/locale/ar.js 4.12 kB {2} [optional] [built]
[67] ./~/moment/locale/az.js 3 kB {2} [optional] [built]
[68] ./~/moment/locale/be.js 4.47 kB {2} [optional] [built]
[69] ./~/moment/locale/bg.js 2.84 kB {2} [optional] [built]
[70] ./~/moment/locale/bn.js 3.22 kB {2} [optional] [built]
[71] ./~/moment/locale/bo.js 3.47 kB {2} [optional] [built]
[72] ./~/moment/locale/br.js 3.11 kB {2} [optional] [built]
[73] ./~/moment/locale/bs.js 4.47 kB {2} [optional] [built]
[74] ./~/moment/locale/ca.js 2.71 kB {2} [optional] [built]
[75] ./~/moment/locale/cs.js 6.1 kB {2} [optional] [built]
[76] ./~/moment/locale/cv.js 2.14 kB {2} [optional] [built]
[77] ./~/moment/locale/cy.js 2.74 kB {2} [optional] [built]
[78] ./~/moment/locale/da.js 1.89 kB {2} [optional] [built]
[79] ./~/moment/locale/de-at.js 2.79 kB {2} [optional] [built]
[80] ./~/moment/locale/de.js 2.72 kB {2} [optional] [built]
[81] ./~/moment/locale/dv.js 2.37 kB {2} [optional] [built]
[82] ./~/moment/locale/el.js 3.4 kB {2} [optional] [built]
[83] ./~/moment/locale/en-au.js 2.17 kB {2} [optional] [built]
[84] ./~/moment/locale/en-ca.js 2.02 kB {2} [optional] [built]
[85] ./~/moment/locale/en-gb.js 2.17 kB {2} [optional] [built]
[86] ./~/moment/locale/en-ie.js 2.17 kB {2} [optional] [built]
[87] ./~/moment/locale/en-nz.js 2.18 kB {2} [optional] [built]
[88] ./~/moment/locale/eo.js 2.45 kB {2} [optional] [built]
[89] ./~/moment/locale/es-do.js 2.7 kB {2} [optional] [built]
[90] ./~/moment/locale/es.js 2.71 kB {2} [optional] [built]
[91] ./~/moment/locale/et.js 2.89 kB {2} [optional] [built]
[92] ./~/moment/locale/eu.js 2.19 kB {2} [optional] [built]
[93] ./~/moment/locale/fa.js 2.92 kB {2} [optional] [built]
[94] ./~/moment/locale/fi.js 3.61 kB {2} [optional] [built]
[95] ./~/moment/locale/fo.js 1.93 kB {2} [optional] [built]
[96] ./~/moment/locale/fr-ca.js 1.91 kB {2} [optional] [built]
[97] ./~/moment/locale/fr-ch.js 2.07 kB {2} [optional] [built]
[98] ./~/moment/locale/fr.js 2.05 kB {2} [optional] [built]
[99] ./~/moment/locale/fy.js 2.42 kB {2} [optional] [built]
[100] ./~/moment/locale/gd.js 2.4 kB {2} [optional] [built]
[101] ./~/moment/locale/gl.js 2.56 kB {2} [optional] [built]
[102] ./~/moment/locale/he.js 3.09 kB {2} [optional] [built]
[103] ./~/moment/locale/hi.js 3.46 kB {2} [optional] [built]
[104] ./~/moment/locale/hr.js 4.59 kB {2} [optional] [built]
[105] ./~/moment/locale/hu.js 3.73 kB {2} [optional] [built]
[106] ./~/moment/locale/hy-am.js 2.94 kB {2} [optional] [built]
[107] ./~/moment/locale/id.js 2.67 kB {2} [optional] [built]
[108] ./~/moment/locale/is.js 4.2 kB {2} [optional] [built]
[109] ./~/moment/locale/it.js 2.25 kB {2} [optional] [built]
[110] ./~/moment/locale/ja.js 1.99 kB {2} [optional] [built]
[111] ./~/moment/locale/jv.js 2.68 kB {2} [optional] [built]
[112] ./~/moment/locale/ka.js 2.85 kB {2} [optional] [built]
[113] ./~/moment/locale/kk.js 2.4 kB {2} [optional] [built]
[114] ./~/moment/locale/km.js 1.86 kB {2} [optional] [built]
[115] ./~/moment/locale/ko.js 1.8 kB {2} [optional] [built]
[116] ./~/moment/locale/ky.js 2.41 kB {2} [optional] [built]
[117] ./~/moment/locale/lb.js 4.45 kB {2} [optional] [built]
[118] ./~/moment/locale/lo.js 2.11 kB {2} [optional] [built]
[119] ./~/moment/locale/lt.js 4.05 kB {2} [optional] [built]
[120] ./~/moment/locale/lv.js 3.6 kB {2} [optional] [built]
[121] ./~/moment/locale/me.js 3.77 kB {2} [optional] [built]
[122] ./~/moment/locale/mi.js 2.22 kB {2} [optional] [built]
[123] ./~/moment/locale/mk.js 2.86 kB {2} [optional] [built]
[124] ./~/moment/locale/ml.js 2.56 kB {2} [optional] [built]
[125] ./~/moment/locale/mr.js 4.84 kB {2} [optional] [built]
[126] ./~/moment/locale/ms-my.js 2.63 kB {2} [optional] [built]
[127] ./~/moment/locale/ms.js 2.57 kB {2} [optional] [built]
[128] ./~/moment/locale/my.js 2.55 kB {2} [optional] [built]
[129] ./~/moment/locale/nb.js 2.05 kB {2} [optional] [built]
[130] ./~/moment/locale/ne.js 3.39 kB {2} [optional] [built]
[131] ./~/moment/locale/nl-be.js 3.2 kB {2} [optional] [built]
[132] ./~/moment/locale/nl.js 3.18 kB {2} [optional] [built]
[133] ./~/moment/locale/nn.js 1.91 kB {2} [optional] [built]
[134] ./~/moment/locale/pa-in.js 3.59 kB {2} [optional] [built]
[135] ./~/moment/locale/pl.js 3.67 kB {2} [optional] [built]
[136] ./~/moment/locale/pt-br.js 2.05 kB {2} [optional] [built]
[137] ./~/moment/locale/pt.js 2.15 kB {2} [optional] [built]
[138] ./~/moment/locale/ro.js 2.38 kB {2} [optional] [built]
[139] ./~/moment/locale/ru.js 6.86 kB {2} [optional] [built]
[140] ./~/moment/locale/se.js 2.05 kB {2} [optional] [built]
[141] ./~/moment/locale/si.js 2.21 kB {2} [optional] [built]
[142] ./~/moment/locale/sk.js 5.25 kB {2} [optional] [built]
[143] ./~/moment/locale/sl.js 5.93 kB {2} [optional] [built]
[144] ./~/moment/locale/sq.js 2.23 kB {2} [optional] [built]
[145] ./~/moment/locale/sr-cyrl.js 3.77 kB {2} [optional] [built]
[146] ./~/moment/locale/sr.js 3.75 kB {2} [optional] [built]
[147] ./~/moment/locale/ss.js 2.83 kB {2} [optional] [built]
[148] ./~/moment/locale/sv.js 2.19 kB {2} [optional] [built]
[149] ./~/moment/locale/sw.js 1.92 kB {2} [optional] [built]
[150] ./~/moment/locale/ta.js 3.77 kB {2} [optional] [built]
[151] ./~/moment/locale/te.js 2.8 kB {2} [optional] [built]
[152] ./~/moment/locale/tet.js 2.25 kB {2} [optional] [built]
[153] ./~/moment/locale/th.js 2.14 kB {2} [optional] [built]
[154] ./~/moment/locale/tl-ph.js 2 kB {2} [optional] [built]
[155] ./~/moment/locale/tlh.js 3.74 kB {2} [optional] [built]
[156] ./~/moment/locale/tr.js 2.61 kB {2} [optional] [built]
[157] ./~/moment/locale/tzl.js 3.3 kB {2} [optional] [built]
[158] ./~/moment/locale/tzm-latn.js 1.93 kB {2} [optional] [built]
[159] ./~/moment/locale/tzm.js 1.89 kB {2} [optional] [built]
[160] ./~/moment/locale/uk.js 4.97 kB {2} [optional] [built]
[161] ./~/moment/locale/uz.js 1.86 kB {2} [optional] [built]
[162] ./~/moment/locale/vi.js 2.46 kB {2} [optional] [built]
[163] ./~/moment/locale/x-pseudo.js 2.29 kB {2} [optional] [built]
[164] ./~/moment/locale/yo.js 1.98 kB {2} [optional] [built]
[165] ./~/moment/locale/zh-cn.js 3.96 kB {2} [optional] [built]
[166] ./~/moment/locale/zh-hk.js 3.02 kB {2} [optional] [built]
[167] ./~/moment/locale/zh-tw.js 2.97 kB {2} [optional] [built]
[192] (webpack)/buildin/module.js 548 bytes {2} [built]
[220] ./~/moment/locale ^\.\/.*$ 2.61 kB {2} [optional] [built]
[304] (webpack)/buildin/global.js 506 bytes {2} [built]
[310] multi vendor 40 bytes {2} [built]
chunk {3} ce5ee126441b838d0255.app.js, assets/css/app.css (app) 12.9 kB {2} [initial] [rendered]
[56] ./app/webpack.svg 90 bytes {3} [built]
[193] ./app/Point_es6.js 1.11 kB {3} [built]
[196] ./app/file.css 41 bytes {3} [built]
[198] ./app/webpack_html/img_html.html 94 bytes {3} [built]
[199] ./app/data/data.json 183 bytes {3} [built]
[200] ./app/file_scss.scss 1.04 kB {3} [built]
[204] ./~/css-loader!./~/sass-loader!./app/file_scss.scss 262 bytes {3} [built]
[205] ./~/css-loader/lib/css-base.js 1.51 kB {3} [built]
[303] ./~/style-loader/addStyles.js 7.15 kB {3} [built]
[308] ./app/index.js 1.46 kB {3} [built]
chunk {4} 18755eaa92f20126c13d.component_collection.js, assets/css/component_collection.css (component_collection) 4.85 kB {2} [initial] [rendered]
[194] ./app/react2.jsx 2.36 kB {4} [built]
[195] ./app/react3.jsx 2.36 kB {4} [built]
[197] ./app/img_css.css 41 bytes {4} [built]
[306] ./app/component_collection.js 92 bytes {4} [built]
chunk {5} b9bf4686146ad520f985.test_external.js (test_external) 332 bytes {2} [initial] [rendered]
[201] external "jQuery" 42 bytes {5} [not cacheable]
[307] ./app/external.js 290 bytes {5} [built]
chunk {6} 517819e2edacb58f7406.react.js (react) 413 bytes {2} [initial] [rendered]
[309] ./app/react.jsx 413 bytes {6} [built]
chunk {7} 13ccb3122f204e277e1b.another.js (another) 91 bytes {2} [initial] [rendered]
[305] ./app/another.js 91 bytes {7} [built]
chunk {8} 1bc95dd7dad91c667477.manifest.js (manifest) 0 bytes [entry] [rendered]
Child extract-text-webpack-plugin:
chunk {0} extract-text-webpack-plugin-output-filename 1.73 kB [entry] [rendered]
[0] ./~/css-loader/lib/css-base.js 1.51 kB {0} [built]
[1] ./~/css-loader!./app/file.css 220 bytes {0} [built]
Child extract-text-webpack-plugin:
Asset Size Chunks Chunk Names
test-37805d3e78d3d5edc40d43d62dc9ebf2.png 3.02 kB
chunk {0} extract-text-webpack-plugin-output-filename 1.82 kB [entry] [rendered]
[0] ./~/css-loader/lib/css-base.js 1.51 kB {0} [built]
[1] ./app/test.png 87 bytes {0} [built]
[2] ./~/css-loader!./app/img_css.css 223 bytes {0} [built]
[23:51:17] Finished 'webpack' after 3.88 s
嗯……有點可怕的感覺，如果要修整這些訊息的顯示，其實在 webpack 的官網關於 Stats 有參數的說明可以如何設定訊息的顯示，哪些要顯示，哪些要隱藏，其實我只要加上以下的設定，就可以簡化很多訊息(近乎就跟原來只執行 webpack、webpack-dev-server 指令時一樣)：
colors: true,
children: false,
chunks: false
所以完整的 gulpfile.js 會是如下：
var gulp = require('gulp');
var gutil = require("gulp-util");
var webpack = require("webpack");
var WebpackDevServer = require("webpack-dev-server");
var webpackConfig = require("./webpack.config.js");
//gulp.task('default', function() {
// place code for your default task here
//});
gulp.task("default", ["webpack-dev-server", "webpack"]);
gulp.task("webpack", function(callback) {
// run webpack
webpack(webpackConfig, function(err, stats) {
if(err) throw new gutil.PluginError("webpack", err);
gutil.log("[webpack]", stats.toString({
colors: true,
children: false,
chunks: false
}));
callback();
});
});
gulp.task("webpack-dev-server", function(callback) {
var myConfig = Object.create(webpackConfig);
// Start a webpack-dev-server
new WebpackDevServer(webpack(myConfig), {
publicPath: "/" + myConfig.output.publicPath,
stats: {
colors: true,
children: false,
chunks: false
}
}).listen(8080, "localhost", function(err) {
if(err) throw new gutil.PluginError("webpack-dev-server", err);
gutil.log("[webpack-dev-server]", "http://localhost:8080/webpack-dev-server/index.html");
});
});
這時執行 gulp webpack 或 gulp webpack-dev-server 指令，就會出現比較易讀的訊息囉。番外篇完結啦。
明天就是 webpack 系列文的最後一篇文章了，有點感動，最後一篇我想應該會著重在一些做網站的心得，以及一點自我介紹。希望大家在這樣的路上，都能有很好的收穫。
iThome鐵人賽
看影片追技術